<template>
  <div class="outline">
    <heaDer></heaDer>
    <!-- <div class="headertop">
      <div class="imgcenter"><img src="../../assets/img1.png" alt="" /></div>
      <div class="name">123</div>
    </div> -->
    <div class="main">
      <!-- <img src="../../assets/snowman.png" alt="" /> -->
    </div>
    <div class="titleP">
      亲爱哒，感谢你的支持与陪伴，欢迎推荐新朋友加入
      我们。每成功推荐一位新的伙伴可以获得
      <span style="color: #ff9500">{{singlePoint}}</span>积分
    </div>
    <div class="but">
      <el-button round @click="openy">好，马上推荐给小伙伴！</el-button>
    </div>
    <div class="listcard">
      <div>已成功推荐<span style="color: #ff9500">{{netlist.length}}</span>位</div>
      <div class="incard">
        <div>微信昵称</div>
        <div>获得积分</div>
      </div>
      <div class="incard" v-for="(item, index) in netlist" :key="index">
        <div>{{ item.userName }}</div>
        <div style="color: #ff9500">{{ item.amount }}</div>
      </div>
    </div>
    <div class="masklayer" v-show="maskopen" @click="maskLayer()">
      <div class="writeshare">
        <div class="imgshare">
          <!-- <img src="../../assets/write.png" alt="" /> -->
        </div>
        <div class="imgshare1">
          <!-- <img src="../../assets/share.png" alt="" /> -->
        </div>
      </div>
    </div>
  </div>
</template>

<script>
import wx from "weixin-js-sdk";
import request from "@/utils/request";
import {
		MessageBox,
		Toast
	} from "mint-ui";
import heaDer from "@/components/page/header/header.vue";
import {server} from "@/utils/env";
export default {
  components: {
    heaDer,
  },
  data() {
    return {
      netlist: [],
      maskopen: false,
      userId: 0,
	  singlePoint:0,
    };
  },
  created() {
	  Toast(window.location.href)
	 
	  if(this.$route.params.time){
		window.location.reload() 
	}
	if(this.$route.query.shareUserId){
			  window.location.href=server.domain+'attention?shareUserId='+this.$route.query.shareUserId
	} 
	// this.getShareInfo()
  },
  methods: {
    
  },
};
</script>

<style lang="less" scoped>
.outline {
  position: relative;
  min-height: 100vh;
}
.headertop {
  display: flex;
  padding: 15px;
}
.headertop .name {
  margin-left: 15px;
  font-size: 16px;
}
.imgcenter {
  width: 50px;
  img {
    width: 100%;
    height: 100%;
  }
}
.main {
  // border: 1px solid red;
  padding: 30px 80px;
  img {
    width: 100%;
    height: 100%;
  }
}
.titleP {
  padding: 0 25px 30px 25px;
  font-size: 16px;
}
.but {
  // border: 1px solid red;
  text-align: center;
  margin-bottom: 25px;
  /deep/.el-button.is-round {
    padding: 12px 60px;
    background: #ff9500;
    color: #ffff;
  }
}
.listcard {
  // border: 1px solid red;
  text-align: center;
  font-weight: bold;
}
.incard {
  display: flex;
  justify-content: space-around;
  align-items: center;
  div {
    padding: 10px;
  }
}
.masklayer {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  height: 100%;
  background: #303030;
  opacity: 0.32;
}
.writeshare {
  // border: 1px solid red;
  padding: 15px;
  width: 100%;
  height: 100px;
  display: flex;
  justify-content: flex-end;
  z-index: 998;
}
.imgshare {
  // border: 1px solid red;
  margin-left: 20px;
  width: 100px;
  height: 80px;

  img {
    width: 100%;
    height: 100%;
  }
}
.imgshare1 {
  // border: 1px solid red;
  margin-left: 20px;
  width: 80px;
  height: 80px;
  img {
    width: 100%;
    height: 100%;
  }
}
</style>